<template>
  <el-card >
    <div slot="header" class="pt-re">
      <div class="clearfix f-row ai-c">
        <div
          v-for="i in typeList"
          :class="['title', current_head == i.id ? 'active' : '']"
          :key="i.id"
          @click="choiceTab(i.id)"
        >
          {{ i.name }}
        </div>
      </div>
    </div>
    <tableAssembly v-bind="$attrs" v-on="$listeners"></tableAssembly>
  </el-card>
</template>
<script>
import tableAssembly from "@/components/common/tabbleAssembly.vue";
export default {
  props: ["current_head", "typeList", "type"],
  components: {
    tableAssembly,
  },
  data() {
    return {
      dialogVisible: false, //叫号器显示隐藏
    };
  },
  methods: {
    choiceTab(id) {
      this.$emit('changeHeadStatus',id)
      console.log(id);
      /* this.current = id; */
    },
  },
};
</script>
<style lang='less' scoped>

.el-card {
  /*  height: 35.625rem !important; */
  /*  height: 100%; */
  width: 100%;
}
/deep/ .el-card__header {
  padding-bottom: 0;
}
.clearfix {
  .title {
    color: #838383;
    letter-spacing: 0.125rem;
    margin-right: 1rem;
    padding-bottom: 1.125rem;
    cursor: pointer;
  }
  .active {
    color: var(--themeCOlor);
    border-bottom: 2px solid var(--themeCOlor);
    font-weight: 600;
  }
}
</style>